/*// Extra small devices (portrait phones, less than 576px)
// No media query since this is the default in Bootstrap*/

/*// Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {}

/*// Medium devices (tablets, 768px and up)*/
@media (max-width: 768px) {
  nav{
    background-color:transparent
  }
  nav .links .menu > li{
    display:block;
    background-color:transparent;
  }
  nav .links {
    background-color:rgba(0,0,0,.5);
    width:100%;
    position:absolute;
    left:0px;
    top:60px;
    display:none;
  }

  nav .links .menu{
    width:100%;
    postion:relative;
    background-color:rgba(0,0,0,.5);
    text-align: center
  }
  nav .brand{
    display:block;
    float:left;
    width:80%;
  }
  nav .icon{
    float:right;
    width:20%;
    line-height: 60px;
    display:block
  }
  nav .icon i{
    float: right;
    line-height: 60px;
    cursor:pointer;
  }
  nav .links .drop-menu{
    display:none;
    position: static;
    margin-top:10px;
    background-color:transparent;
  }
  nav .links .drop-menu li{
    border:none;
    text-align: center;
  }
 }

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {}

/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {}